<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>扇贝，知道你在改变</title>
		<link rel="stylesheet" type="text/css" href="css/style.css"/>
		<link rel="stylesheet" type="text/css" href="css/bootstrap-theme.css"/>
		<link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css"/>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.css"/>
		<link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
	</head>
	<body>
		<div class="head">
			<div class="col-xs-3">
				<div class="denglu">
				<a>登录</a>
				</div>
			</div>
<div class="col-xs-2">
				<div class="zhuce">
				<a>&nbsp;注册</a>
				</div>
			</div>
		</div>
		<div class="box">
			<div class="top">
				<img src="img/logo_v5.png" />
				<div class="col-xs-6" style="margin-top: 5%;margin-left: -5%;">
					<a>单词 &nbsp;&nbsp; &nbsp; &nbsp; </a>
					<a>听力 &nbsp; &nbsp; &nbsp;&nbsp; </a>
					<a>口语 &nbsp; &nbsp;&nbsp; &nbsp; </a>
					<a>阅读&nbsp;  &nbsp;&nbsp;&nbsp;&nbsp; </a>
					<a>炼句 </a>
			
				</div>
			</div>
			<div class="col-xs-11">
			<div class="flexslider" style="margin-top: 1%;margin-left: 9%;">
	<ul class="slides">
		<li style="background:url(img/shanbei1.png) 50% 0 no-repeat;"></li>
		<li style="background:url(img/shanbei2.png) 50% 0 no-repeat;"></li>	
		<li style="background:url(img/shanbei3.png) 50% 0 no-repeat;"></li>		
	</ul>
</div></div>
<script src="css/jquery-1.11.0.min.js" type="text/javascript"></script>
<script type="text/javascript" src="css/jquery.flexslider-min.js"></script>
<script type="text/javascript">
	$(document).ready(function(){
		$('.flexslider').flexslider({
			directionNav: true,
			pauseOnAction: false
		});
	});
</script>
<div class="middle" style="margin-top: 50%;">
	 <div class="col-xs-6 col-md-3 col-xs-offset-3">
	<div  style="position: relative;">
		<img src="img/圆.png" style="position: absolute;z-index: 1;width: 120px;height: 120px;"/>
		<img src="img/单词.png" style="position: absolute;z-index: 2;width: 80px;height: 80px;margin-left: 5%;"/>
	</div>
	<div class="caption">
	<a >&nbsp;&nbsp;&nbsp;&nbsp;测单词量</a>
		<p style="margin-top: 8%;">不知道自己的词汇量<br />
&nbsp;&nbsp;还怎么学英语<br />
&nbsp;&nbsp;赶快来试一试</p>
	</div>
</div>
<div class="col-xs-6 col-md-3">
	<div style="position: relative;">
		<img src="img/圆2.png" style="position: absolute;z-index: 1;width: 120px;height: 120px;"/>
		<img src="img/考试.png" style="position: absolute;z-index: 2;width: 80px;height: 80px;margin-left: 5%;"/></div>
	<div class="caption" >
	<a style="margin-left: 10%;">考试保险</a>
		<p style="margin-top: 8%;">
相信扇贝，更相信自己<br/>
&nbsp;&nbsp;&nbsp;&nbsp;一份努力,一份收获<br />&nbsp;&nbsp;&nbsp;&nbsp;考试不过找扇贝
</p>
	</div>	
</div>
<div class="col-xs-6 col-md-3">
	<div style="position: relative;">
		<img src="img/留言信箱.png" style="position: absolute;z-index: 1;width: 120px;height: 120px;"/>
		<img src="img/信封.png" style="position: absolute;z-index: 2;width: 80px;height: 80px;margin-left: 5%;"/></div>
	<div class="caption" >
	<a style="margin-left: 10%;">扇贝社区</a>
		<p style="margin-top: 10%;">
学习路上，你不孤单<br />
小组长"骚扰"你，关怀你<br />
就是要让你一起坚持<br />
</p>
	</div>
</div>
</div>
</div>


</div>

		
		<div class="footer" style="width: 110%;margin-top: 80%;">
			<div class="col-xs-10" style="background-color:#F5F5F5;margin-left: 6%;">
				<div style="margin-top: 3%;">
				<div class="col-xs-2 col-xs-offset-2">
					<h4>如何使用</h4>

帮助<br />
小组<br />
博客<br />
论坛<br />
你问我答
				</div>
				<div class="col-xs-2">
					<h4>关于扇贝</h4>

关注我们<br />
加入我们<br />
关于我们<br />
				</div>
				<div class="col-xs-2">
					<h4>开发者</h4>

wiki
				</div>
				<div style="margin-left: 50%;">
					<h4>合作伙伴</h4>
					<img src="img/Collins.jpeg" style="width: 24%;height: 18%;"/>
				</div>
				
			</div>
			</div>
		</div>
	</body>
</html>
